import 'package:flutter/material.dart';
import 'package:flutter_swiper_view/flutter_swiper_view.dart';

import 'package:get/get.dart';
import 'package:xiaomi_shop/app/services/iconWrapper.dart';
import 'package:xiaomi_shop/app/services/screenAdapter.dart';

import '../controllers/user_controller.dart';

class UserView extends GetView<UserController> {
  const UserView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.grey.shade100,
        elevation: 0,
        scrolledUnderElevation: 0,
        actions: [
          Row(children: [
            Text(
              "会员码",
              style: TextStyle(fontSize: ScreenAdapter.fontSize(38)),
            ),
            IconButton(onPressed: () {}, icon: const Icon(Icons.qr_code)),
          ]),
          IconButton(
              onPressed: () {}, icon: const Icon(Icons.settings_outlined)),
          IconButton(onPressed: () {}, icon: const Icon(Icons.message_outlined))
        ],
      ),
      body: Container(
        color: Colors.grey.shade100,
        child: ListView(
          padding: EdgeInsets.fromLTRB(ScreenAdapter.width(30), 0,
              ScreenAdapter.width(30), ScreenAdapter.width(30)),
          children: [
            // 登录注册
            Container(
              width: ScreenAdapter.width(1080),
              height: ScreenAdapter.height(190),
              alignment: Alignment.topLeft,
              child: Obx(() => controller.loginState.value
                  ? Row(
                      children: [
                        SizedBox(
                          width: ScreenAdapter.width(150),
                          height: ScreenAdapter.width(150),
                          child: CircleAvatar(
                            radius: ScreenAdapter.width(75),
                            backgroundImage:
                                AssetImage("assets/images/user.png"),
                          ),
                        ),
                        SizedBox(
                          width: ScreenAdapter.width(40),
                        ),
                        InkWell(
                            onTap: () {},
                            child: Text(
                              controller.userModel.value!.username!,
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(60),
                                  fontWeight: FontWeight.w400),
                            )),
                        SizedBox(
                          width: ScreenAdapter.width(30),
                        ),
                        Icon(
                          Icons.chevron_right_outlined,
                          color: Colors.grey.shade500,
                        )
                      ],
                    )
                  : Row(
                      children: [
                        SizedBox(
                          width: ScreenAdapter.width(150),
                          height: ScreenAdapter.width(150),
                          child: CircleAvatar(
                            radius: ScreenAdapter.width(75),
                            backgroundImage:
                                AssetImage("assets/images/user.png"),
                          ),
                        ),
                        SizedBox(
                          width: ScreenAdapter.width(40),
                        ),
                        InkWell(
                            onTap: () {
                              Get.toNamed("/phone-one-click-login");
                            },
                            child: Text(
                              "登录/注册",
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(60),
                                  fontWeight: FontWeight.w400),
                            )),
                        SizedBox(
                          width: ScreenAdapter.width(30),
                        ),
                        Icon(
                          Icons.chevron_right_outlined,
                          color: Colors.grey.shade500,
                        )
                      ],
                    )),
            ),
            // 金币
            Obx(() => Container(
                  width: ScreenAdapter.width(1080),
                  height: ScreenAdapter.height(160),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: [
                      Expanded(
                          child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            controller.loginState.value
                                ? "${controller.userModel.value!.gold}"
                                : "0",
                            style: TextStyle(
                                color: Colors.black,
                                fontWeight: FontWeight.bold,
                                fontSize: ScreenAdapter.fontSize(50)),
                          ),
                          Text(
                            "米金",
                            style: TextStyle(color: Colors.black54),
                          )
                        ],
                      )),
                      Expanded(
                          child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            controller.loginState.value
                                ? "${controller.userModel.value!.coupon}"
                                : "0",
                            style: TextStyle(
                                color: Colors.black,
                                fontWeight: FontWeight.bold,
                                fontSize: ScreenAdapter.fontSize(50)),
                          ),
                          Text(
                            "优惠券",
                            style: TextStyle(color: Colors.black54),
                          )
                        ],
                      )),
                      Expanded(
                          child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            controller.loginState.value
                                ? "${controller.userModel.value!.redPacket}"
                                : "0",
                            style: TextStyle(
                                color: Colors.black,
                                fontWeight: FontWeight.bold,
                                fontSize: ScreenAdapter.fontSize(50)),
                          ),
                          Text(
                            "红包",
                            style: TextStyle(color: Colors.black54),
                          )
                        ],
                      )),
                      Expanded(
                          child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            controller.loginState.value
                                ? "${controller.userModel.value!.quota}"
                                : "0",
                            style: TextStyle(
                                color: Colors.black,
                                fontWeight: FontWeight.bold,
                                fontSize: ScreenAdapter.fontSize(50)),
                          ),
                          Text(
                            "最高额度",
                            style: TextStyle(color: Colors.black54),
                          )
                        ],
                      )),
                      Expanded(
                          child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Icon(
                            Icons.bookmarks_outlined,
                            size: ScreenAdapter.height(70),
                          ),
                          Text(
                            "钱包",
                            style: TextStyle(color: Colors.black54),
                          )
                        ],
                      )),
                    ],
                  ),
                )),
            // 广告1
            Container(
              margin: EdgeInsets.only(top: ScreenAdapter.height(40)),
              decoration:
                  BoxDecoration(borderRadius: BorderRadius.circular(10)),
              clipBehavior: Clip.hardEdge,
              child: Image.asset(
                "assets/images/user_ad1.png",
                fit: BoxFit.contain,
              ),
            ),
            // 订单
            Container(
              margin: EdgeInsets.only(top: ScreenAdapter.height(40)),
              padding: EdgeInsets.fromLTRB(
                  ScreenAdapter.width(30),
                  ScreenAdapter.width(20),
                  ScreenAdapter.width(30),
                  ScreenAdapter.width(30)),
              height: ScreenAdapter.height(370),
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(10)),
              clipBehavior: Clip.hardEdge,
              child: Column(
                children: [
                  Obx(() => SizedBox(
                        height: ScreenAdapter.height(100),
                        child: Row(
                          children: [
                            Expanded(
                                child: Text(
                              controller.loginState.value
                                  ? "收藏(${controller.userModel.value!.collect})"
                                  : "收藏",
                              textAlign: TextAlign.center,
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(44),
                                  color: Colors.black54),
                            )),
                            Container(
                              width: 1,
                              height: ScreenAdapter.height(40),
                              color: Colors.grey.shade300,
                            ),
                            Expanded(
                                child: Text(
                              controller.loginState.value
                                  ? "足迹(${controller.userModel.value!.footmark})"
                                  : "足迹",
                              textAlign: TextAlign.center,
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(44),
                                  color: Colors.black54),
                            )),
                            Container(
                              width: 1,
                              height: ScreenAdapter.height(40),
                              color: Colors.grey.shade300,
                            ),
                            Expanded(
                                child: Text(
                              controller.loginState.value
                                  ? "关注(${controller.userModel.value!.follow})"
                                  : "关注",
                              textAlign: TextAlign.center,
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(44),
                                  color: Colors.black54),
                            ))
                          ],
                        ),
                      )),
                  Divider(
                    color: Colors.grey.shade300,
                  ),
                  SizedBox(
                    height: ScreenAdapter.height(20),
                  ),
                  Expanded(
                      child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: [
                        Expanded(
                            child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Icon(
                              Icons.bookmarks_outlined,
                              color: Colors.black87,
                              size: ScreenAdapter.height(70),
                            ),
                            Text(
                              "待付款",
                              style: TextStyle(
                                  color: Colors.black87,
                                  fontSize: ScreenAdapter.fontSize(40)),
                            )
                          ],
                        )),
                        Expanded(
                            child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Icon(
                              Icons.car_crash,
                              color: Colors.black87,
                              size: ScreenAdapter.height(70),
                            ),
                            Text(
                              "待收货",
                              style: TextStyle(
                                  color: Colors.black87,
                                  fontSize: ScreenAdapter.fontSize(40)),
                            )
                          ],
                        )),
                        Expanded(
                            child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Icon(
                              Icons.comment_bank_outlined,
                              color: Colors.black87,
                              size: ScreenAdapter.height(70),
                            ),
                            Text(
                              "待评价",
                              style: TextStyle(
                                  color: Colors.black87,
                                  fontSize: ScreenAdapter.fontSize(40)),
                            )
                          ],
                        )),
                        Expanded(
                            child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Icon(
                              Icons.change_circle_outlined,
                              color: Colors.black87,
                              size: ScreenAdapter.height(70),
                            ),
                            Text(
                              "退换/售后",
                              style: TextStyle(
                                  color: Colors.black87,
                                  fontSize: ScreenAdapter.fontSize(40)),
                            )
                          ],
                        )),
                        Expanded(
                            child: InkWell(
                          onTap: () {
                            Get.toNamed("/order-list");
                          },
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Icon(
                                Icons.copy_all_rounded,
                                color: Colors.black87,
                                size: ScreenAdapter.height(70),
                              ),
                              Text(
                                "全部订单",
                                style: TextStyle(
                                    color: Colors.black87,
                                    fontSize: ScreenAdapter.fontSize(40)),
                              )
                            ],
                          ),
                        )),
                      ]))
                ],
              ),
            ),
            // 服务
            Container(
              margin: EdgeInsets.only(top: ScreenAdapter.height(40)),
              padding: EdgeInsets.fromLTRB(
                  ScreenAdapter.width(30),
                  ScreenAdapter.width(20),
                  ScreenAdapter.width(30),
                  ScreenAdapter.width(30)),
              height: ScreenAdapter.height(550),
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(10)),
              clipBehavior: Clip.hardEdge,
              child: Column(
                children: [
                  Container(
                    height: ScreenAdapter.height(120),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          "服务",
                          style: TextStyle(
                              fontSize: ScreenAdapter.fontSize(40),
                              fontWeight: FontWeight.bold),
                        ),
                        Row(
                          children: [
                            Text(
                              "更多服务",
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(34),
                                  color: Colors.black54),
                            ),
                            SizedBox(
                              width: ScreenAdapter.width(20),
                            ),
                            Icon(
                              Icons.arrow_forward_ios,
                              color: Colors.black54,
                              size: ScreenAdapter.width(40),
                            ),
                          ],
                        )
                      ],
                    ),
                  ),
                  Expanded(
                      child: GridView.builder(
                    padding: EdgeInsets.fromLTRB(
                        ScreenAdapter.width(0),
                        ScreenAdapter.width(20),
                        ScreenAdapter.width(0),
                        ScreenAdapter.width(20)),
                    physics: const NeverScrollableScrollPhysics(),
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: 4,
                        mainAxisSpacing: ScreenAdapter.height(40),
                        childAspectRatio: 1.6),
                    itemCount: controller.serviceIcons.length,
                    itemBuilder: (context, index) {
                      return Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Icon(
                            controller.serviceIcons[index]["iconName"],
                            size: ScreenAdapter.width(76),
                          ),
                          Text(controller.serviceIcons[index]["title"])
                        ],
                      );
                    },
                  ))
                ],
              ),
            ),
            SizedBox(
              height: ScreenAdapter.height(40),
            ),
            // 广告
            Container(
              height: ScreenAdapter.height(310),
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(10)),
              clipBehavior: Clip.hardEdge,
              child: Swiper(
                autoplay: true,
                loop: true,
                pagination: const SwiperPagination(),
                itemCount: controller.adList.length,
                itemBuilder: (context, index) {
                  return Image.asset(
                    controller.adList[index],
                    fit: BoxFit.fill,
                  );
                },
              ),
            ),
            // 退出登录
            Obx(() => controller.loginState.value
                ? Container(
                    margin: EdgeInsets.only(
                        top: ScreenAdapter.height(60),
                        left: ScreenAdapter.height(80),
                        right: ScreenAdapter.height(80)),
                    height: ScreenAdapter.height(136),
                    child: ElevatedButton(
                        style: ButtonStyle(
                            backgroundColor:
                                MaterialStatePropertyAll(Colors.red),
                            foregroundColor:
                                MaterialStatePropertyAll(Colors.white),
                            textStyle: MaterialStatePropertyAll(TextStyle(
                                fontSize: ScreenAdapter.fontSize(40),
                                fontWeight: FontWeight.bold))),
                        onPressed: () {
                          Get.defaultDialog(
                            title: "确定退出登录？",
                            middleText: "",
                            textCancel: "取消",
                            textConfirm: "确定",
                            onConfirm: () {
                              controller.loginOut();
                              Get.back();
                            },
                          );
                        },
                        child: const Text("退出登录")),
                  )
                : Text("")),
          ],
        ),
      ),
    );
  }
}
